import React from 'react';
// import './public/style.css'

import {contents} from './styles'
import Header from './Header';
import Menu from './Menu'
import Content from './Content'
import Login from './Login'
import {StaticRouter as Router, Redirect, Route} from 'react-router-dom'
import State from './State'

var App_ = React.createClass({
    render() {
        return (
            <Router>
                <div>
                    <Header />
                    <div style={contents}>
                        <Menu />
                        <Content />
                    </div>
                </div>
            </Router>
        );
    }
});

const ProtectedComponent = ()=> {
    if (State.isLogined == 1) {
        return (
            <div>
                <Header />
                <div style={contents}>
                    <Menu />
                    <Content />
                </div>
            </div>);
    }
    return <Redirect to="/login"/>
}

// const App = ()=> {
//     return (
//         <Router>
//             <div>
//                 <ProtectedComponent />
//                 <Route path="/login" exact component={Login}/>
//             </div>
//         </Router>
//     );
// }

class App extends React.Component {

    render() {
        return (<div>
            <ProtectedComponent />
            <Route path="/login" exact component={Login}/>
        </div>);
    }
}

module.exports = App;